import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    cartList: [
      { id: 1, name: "apple", price: 100 },
      { id: 2, name: "banana", price: 200 },
    ],
  },

  // 相对与对当前的 state 做一层 计算属性，基于当前的某个或多个state得到一个新的值，可以直接拿到组件中使用的。
  getters: {
    // key: value
    //    key     getter 的名字
    //    value(state, getters)   计算这个 getter 值的函数

    // cartList 的长度
    length(state) {
      return state.cartList.length;
    },

    total(state) {
      return state.cartList.reduce((total, item) => {
        return (total += item.price);
      }, 0);
    },
  },
});
